<!-- 搜索条展开/收起的开关小按钮，结合fpsHelper使用, fpsHelper提供了searchBarVisibility数据，用它来控制搜索栏的开合 -->
<template>
  <q-btn :icon="internalValue?'remove':'search'" :title="internalValue?$t('收起搜索栏'):$t('展开搜索栏')"
    @click="internalValue=!internalValue" :color="props.isInTableTop?'':'primary'" dense :flat="props.isInTableTop"
    :size="props.isInTableTop?'':'sm'" :ripple="false" />
</template>

<script lang="ts">
export default {
  name: 'SearchBarToggleBtn'
}
</script>
<script lang="ts" setup>

import {computed} from 'vue'

interface PropsDef {
  modelValue: boolean,
  isInTableTop?: boolean
}

const props = withDefaults(defineProps<PropsDef>(), {
  isInTableTop: false
})

const emit = defineEmits<{
  (e: 'update:modelValue', data: boolean): void
}>()

const internalValue = computed({
  get() {
    return props.modelValue
  },
  set(val: boolean) {
    emit('update:modelValue', val)
  }
})

</script>
